<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" cheome="1" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="keywords" content="纽曼官网，纽曼电器" />
    <meta name="description" content="该网站为纽曼公司的一个产品展示网站" />
    <meta name="reder" content="webkit" />
    <title>联系我们</title>
    <link rel="stylesheet" href="../css/reset.css" />
    <link rel="stylesheet" href="../css/public.css" />
    <link rel="stylesheet" href="./css/concat.css" />
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script>
</head>
<body>
    <!-- 导航栏 -->
    <header>
        <a href="../index.html"><img src="../home/images/logo.jpg" alt="logo" class="logo" /></a>         
        <ul class="nav">
            <li><a href="../index.html">企业首页</a></li>
            <li><a href="../about/about.html">关于我们</a></li>
            <li><a href="../news/news.html">新闻中心</a></li>
            <li><a href="../product/product.html">产品中心</a></li>
            <li><a href="../service/service.html">客户服务</a></li>
            <li><a href="../concat/concat.html" class="active">联系我们</a></li>
        </ul>
        <ul class="language">
            <li>CN</li>
            <li>EN</li>
        </ul>
    </header>
    <!-- 轮播图 -->
    <div class="bander">
        <img src="../about/images/about-bander.jpg" alt="bander_01">
    </div>
    <!-- concat -->
    <div class="container">
        <aside>
            <div class="aside-content">
                <div class="aside-title">
                <h2 class="title">content us</h2> 
                <p>联系我们</p>
                </div>
                <div class="aside-list">
                    <ul>
                        <li><p>carefully create</p></li>
                        <li><p>and</p></li>
                        <li><p>elaborate service</p></li>
                        <li><p>精心创造  精心服务</p></li>
                    </ul>
                </div>
            </div>    
            <div class="search">
                <div class="aside-title">
                    <h2 class="title">search</h2> 
                    <p>搜索</p>
                </div>
                <div class="aside-list">
                    <input type="text">
                    <span class="iconfont iconsearch"></span>
                </div>
            </div>    
        </aside>
        <div class="container-content">
            <div class="content-title">
                <h3>联系我们 <span>contact us</span></h3>
                <div class="crumbs-nav">您当前的位置&nbsp;&nbsp;&gt;&nbsp;&nbsp;<a href="../index.html">首页</a>&nbsp;&nbsp;&gt;&nbsp;<span>联系我们</span></div>
            </div>
           <div class="concat-content">
                 <!-- 地图 -->
                <div class="map">
                    <div style="width:970px;height:280px;border:#ccc solid 1px;font-size:12px" id="map"></div>
                </div>
                 <!-- 留言 -->    
                <form action="#" class="words">
                    <label>姓名:</label><input type="text"><br>
                    <label>邮箱:</label><input type="email"><br>
                    <label class="words-label3">留言:</label><textarea cols="30" rows="10"></textarea><br>
                    <input type="submit" class="contcat-submit">
                    <input type="reset"class="contcat-reset" disabled>
                </form>
                <div class="contcat-us">
                    <h2>联系方式</h2>
                    <ul>
                        <li>地址：广州市天河区大观南路26号（长胜商务大厦D栋）</li>
                        <li>手机：13434316048 </li>
                        <li>QQ：332857028 </li>
                        <li>邮箱：332857028@qq.com</li>
                    </ul>
                </div>
           </div> 
        </div>
    </div>
      <!-- footer -->
      <footer>
        <div class="footer">
            <div class="footer-content">
                <div class="footer-nav">        
                    <dl>
                        <dt><a href="#">关于我们</a></dt>
                        <dd><a href="#">公司简介</a></dd>
                        <dd><a href="#">企业文化</a></dd>
                        <dd><a href="#">企业荣誉</a></dd>
                        <dd><a href="#">资格认证</a> </dd>
                        <dd><a href="#">研发生产</a></dd>
                    </dl>
                    <dl>
                        <dt><a href="#">产品中心</a></dt>
                        <dd><a href="#">饮水机</a></dd>
                        <dd><a href="#">冰箱</a></dd>
                        <dd><a href="#">洗衣机</a></dd>
                        <dd><a href="#">空调</a></dd>
                        <dd><a href="#">其他产品</a></dd>
                    </dl>
                    <dl>
                        <dt><a href="#">新闻中心</a></dt>
                        <dd><a href="#">最新动态</a></dd>
                        <dd><a href="#">企业新闻</a></dd>
                        <dd><a href="#">行业新闻</a></dd>
                        <dd><a href="#">热点聚焦</a></dd>
                    </dl>
                    <dl>
                        <dt><a href="#">客户服务</a></dt>
                        <dd><a href="#">招商网加盟</a></dd>
                        <dd><a href="#">购买流程</a></dd>
                        <dd><a href="#">售后服务</a></dd>
                        <dd><a href="#">技术支持</a></dd>
                        <dd><a href="#">常见问题</a></dd>
                    </dl>
                    <dl>
                        <dt><a href="#">联系我们</a></dt>
                        <dd><a href="#">在线留言</a></dd>
                        <dd><a href="#">网上咨询</a></dd>
                        <dd><a href="#">联系我们</a></dd>
                    </dl>
                </div>
                <form action="#" class="footer-concar">
                    <input type="text" name="name" placeholder="请输入您的姓名" />
                    <input type="text" name="tel" placeholder="请输入您的联系方式" /><br />
                    <textarea name="" id="" cols="30" rows="10" placeholder="请输入您的留言"></textarea>
                    <input type="button" value="提交">
                </form>
            </div>
        </div>
        <div class="copyright"><p>Copyright&copy;2016WenCun.com All Rights Reserved    Design by WenCun 粤ICP备13005446号-1</p></div> 
    </footer>
</body>
<script type="text/javascript">
    //创建和初始化地图函数：
    function initMap(){
      createMap();//创建地图
      setMapEvent();//设置地图事件
      addMapControl();//向地图添加控件
      addMapOverlay();//向地图添加覆盖物
    }
    function createMap(){ 
      map = new BMap.Map("map"); 
      map.centerAndZoom(new BMap.Point(114.08718,22.631955),15);
    }
    function setMapEvent(){
      map.enableScrollWheelZoom();
      map.enableKeyboard();
      map.enableDragging();
      map.enableDoubleClickZoom()
    }
    function addClickHandler(target,window){
      target.addEventListener("click",function(){
        target.openInfoWindow(window);
      });
    }
    function addMapOverlay(){
      var markers = [
        {content:"我的备注",title:"我的标记",imageOffset: {width:0,height:3},position:{lat:22.628686,lng:114.084234}}
      ];
      for(var index = 0; index < markers.length; index++ ){
        var point = new BMap.Point(markers[index].position.lng,markers[index].position.lat);
        var marker = new BMap.Marker(point,{icon:new BMap.Icon("http://api.map.baidu.com/lbsapi/createmap/images/icon.png",new BMap.Size(20,25),{
          imageOffset: new BMap.Size(markers[index].imageOffset.width,markers[index].imageOffset.height)
        })});
        var label = new BMap.Label(markers[index].title,{offset: new BMap.Size(25,5)});
        var opts = {
          width: 200,
          title: markers[index].title,
          enableMessage: false
        };
        var infoWindow = new BMap.InfoWindow(markers[index].content,opts);
        marker.setLabel(label);
        addClickHandler(marker,infoWindow);
        map.addOverlay(marker);
      };
    }
    //向地图添加控件
    function addMapControl(){
      var navControl = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});
      map.addControl(navControl);
    }
    var map;
      initMap();
  </script>
</html>